<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		
	</head>
	
	<style>
		svg{
			width:100px;
			height: 100px;
			position: relative;
			animation: infinite;
			animation-name: A;
			animation-duration: 5s;
			animation-timing-function: ease;
			animation-delay:1s;
		}
		
		@keyframes A{
			0%{left:0px; top:0px;}
			25%{left:500px; top:0px; color:red;}
			75%{left:1000px; top:0px; rotateX(180deg); color:lightblue;}
			100%{left:0px; top:0px; color:pink;}
			
			
		}
	</style>